<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
<div class="list-box">
    <div class="nav">
        <ul>
            <li>解决方案管理</li>
            <li>/</li>
            <li>方案列表</li>
        </ul>
    </div>
    <div class="search">
        <form>
            方案标题 : <input type="text" id="title">
            方案类别 : <select id="selectType"></select>
            <input type="button" class="btn" value="搜索" onclick="searchBntClick()">
        </form>
    </div>
    <div class="toolbar">
        <input type="button" class="btn" value="新增方案" id="addBtn">
        <input type="button" class="btn" value="删除方案" onclick="deletes()">
    </div>
    <div>
        <table id="solutionTable"></table>
    </div>
    <div class="page">
        <ul id="page-bar"></ul>
    </div>
</div>
<script>
    var updateId;//更新方案的编号
    var updateTypeId;//更新方案的类型编号
    function loadList(page) {
        page = page == undefined ? 1 : page;
        $.get("/web/solution", {
            op: "queryByPage",
            page: page,
            solutionTitle: $("#title").val(),
            catId: $("#selectType").val()
        }, function (data) {
            var table = $("#solutionTable");
            table.empty();
            table.append(`<tr>
                <th><input type="checkbox" id="check" onclick="checkAll()"></th>
                <th>编号</th>
                <th>标题</th>
                <th>方案类型</th>
                <th>添加时间</th>
                <th>最后一次修改时间</th>
                <th>操作</th>
            </tr>`);
            for (let i = 0; i < data.rows.length; i++) {
                var p = data.rows[i];
                table.append(`<tr>
                <td><input type="checkbox" value="${p.solutionId}"></td>
                <td>${p.solutionId}</td>
                <td>${p.solutionTitle}</td>
                <td>${p.solutionTypeId}</td>
                <td>${p.createTime}</td>
                <td>${p.modifyTime}</td>
                <td>
                    <input type="button" class="btn" value="编辑" onclick="editSolution(${p.solutionId},${p.solutionTypeId})">
                    <input type="button" class="btn" value="删除" onclick="deleteSolution(${p.solutionId})">
                </td>
            </tr>`);
            }
            var pageBar = $("#page-bar");
            pageBar.empty();
            pageBar.append("<li onclick='loadList(" + ((page - 1) < 1 ? 1 : (page - 1)) + ")'>&lt;&lt;</li>");
            // 计算要显示的最大的页码
            var start = 1;
            var end = 1;
            if (data.maxPage <= 10) {
                end = data.maxPage;
            } else if (data.maxPage > 10) {
                start = (data.page - 4) > 0 ? (data.page - 4) : 1;
                end = (start + 9) > data.maxPage ? data.maxPage : (start + 9);
            }
            // 显示其它页
            for (var x = start; x <= end; x++) {
                if (x == data.page) {
                    pageBar.append("<li class='page-active' >" + x + "</li>");
                } else {
                    pageBar.append("<li onclick='loadList(" + x + ")'>" + x + "</li>");
                }
            }
            pageBar.append("<li onclick='loadList(" + ((page + 1) > data.maxPage ? data.maxPage :
                (page + 1)) + ")'>&gt;&gt;</li>");
        });
    }

    function searchBntClick() {
        loadList(1);
    }

    $(function () {
        // 页面一加载就加载默认数据
        loadList(1);
        //添加方案类型列表
        $.get("../solutionType", {op: "list"}, function (data) {
            $("#selectType").append("<option value=0 selected>未选择..</option>");
            for (let i = 0; i < data.length; i++) {
                $("#selectType").append("<option value=" + data[i].solutionTypeId + ">" + data[i].solutionTypeTitle + "</option>");
            }
        });
        //添加页面跳转
        $("#addBtn").click(function () {
            $("#content").load("solution/solution-add.html");
        });
    })

    //全选操作
    function checkAll() {
        var flag = $("#check").prop("checked");
        $("input[type='checkbox']").prop("checked", flag);
    }

    //批量删除
    function deletes() {
        if (confirm("您确定要删除吗？")) {
            var param = "op=deleteBatch";
            var inputs = $("input[type='checkbox']:not(#check)");
            for (let i = 0; i < inputs.length; i++) {
                if ($(inputs[i]).prop("checked")) {
                    param += "&solutionId=" + $(inputs[i]).val();
                }
            }
            $.get("/web/solution", param, function (data) {
                alert(data);
                $("#content").load("solution/solution-list.html");
            });
        }
    }

    //删除操作
    function deleteSolution(id) {
        if (confirm("您确定要删除吗？")) {
            $.get("/web/solution", {solutionId: id, op: "delete"}, function (data) {
                alert(data);
                $("#content").load("solution/solution-list.html");
            });
        }
    }

    //编辑操作
    function editSolution(id, tid) {
        updateId = id;
        updateTypeId = tid;
        $("#content").load("solution/solution-update.html");
    }
</script>
</body>
</html>